﻿<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Users
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="CurrentMenuIDContent" runat="server" >configMenu</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="HeadContent" runat="server">
    <link rel="stylesheet" type="text/css" href="../../Content/jquery-ui-1.8.16.custom.css" />
    <script type="text/javascript" src="../../Scripts/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript" src="../../Scripts/site.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery.tablesorter.min.js"></script>
    <script type="text/javascript" src="../../Scripts/jquery.tablesorter.pager.js"></script>
    <script src="<%= Url.Content("~/Scripts/MicrosoftAjax.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jquery.validate.min.js") %>" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <table>
        <tr>
            <td width="130px">
                <h2>
                    Users</h2>
            </td>
            <td>
                <input type="submit" class="button" value="Create" onclick="javascript:createUser(); return false;" />
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <%  Using (Ajax.BeginForm("SaveUser", New AjaxOptions With {.UpdateTargetId = "userListContent", .OnBegin = "formValidate", .OnSuccess = "cancel"}))%>
                <div id="userDetailContent">
                    &nbsp
                </div>
                <% End Using%>
            </td>
        </tr>
        <tr>
            <td>
                Filter By Site:
            </td>
            <td>
                <%= Html.DropDownList("Site", "---All---")%>
            </td>
        </tr>
        <tr>
            <td>
                Filter By Role:
            </td>
            <td>
                <%= Html.DropDownList("Role", "---All---")%>
            </td>
        </tr>
        <tr>
            <td>
                Filter By Staus:
            </td>
            <td>
                <select id="Status">
                    <option value="">All</option>
                    <option value="Inactive">Inactive</option>
                    <option value="Active" selected="selected">Active</option>
                </select>
            </td>
        </tr>
        <tr>
            <td colspan="2">
            </td>
        </tr>
        <tr>
            <td id="userListContent" colspan="2">
                <% Html.RenderPartial("~/Views/User/Controls/UserGrid.ascx")%>
            </td>
        </tr>
    </table>
    <% Html.RenderPartial("~/Views/History/Controls/History.ascx")%>
    <script type="text/javascript">
        var selectedUserID = 0;

        function createUser() {
            showLoading("userDetailContent", true);
            jQuery.ajax({
                type: 'GET',
                url: '<%= Html.AttributeEncode(Url.Action("UserDetail/0")) %>',
                success: function (result) {
                    $('#userDetailContent').html(result).removeClass("hidden");
                    hideLoading("userDetailContent");
                    initSiteSelect();
                }
            });
            selectedUserID = 0;
        }

        function selectUser(id, siteID) {
            showLoading("userDetailContent", true);
            jQuery.ajax({
                type: 'GET',
                url: '<%= Html.AttributeEncode(Url.Action("UserDetail/")) %>' + id,
                success: function (result) {
                    $('#userDetailContent').html(result).removeClass("hidden");
                    hideLoading("userDetailContent");
                    initSiteSelect();
                }
            });
            selectedUserID = id;
        }

        function saveUser() {
            showLoading("userDetailContent", true);
            var desc = $("#userName").val();
            var siteID = $("#Site").val();
            jQuery.ajax({
                type: 'POST',
                data: { siteID: siteID, id: selectedUserID, desc: desc },
                url: '<%= Html.AttributeEncode(Url.Action("SaveUser")) %>',
                success: function (result) {
                    $('#userListContent').html(result);
                    selectedUserID = 0;
                    hideLoading("userDetailContent");
                }
            });
            $("#userDetailContent").addClass("hidden");
        }

        function cancel() {
            $("#userDetailContent").addClass("hidden");
        }

        $(document).ready(function () {
            $("select").change(function () {
                showLoading("userListContent", true);
                var roleID = $("#Role").val();
                var siteID = $("#Site").val();
                var status = $("#Status").val();
                jQuery.ajax({
                    type: 'POST',
                    data: { siteID: siteID, roleID: roleID, status: status },
                    url: '<%= Html.AttributeEncode(Url.Action("FilterUsers")) %>',
                    success: function (result) {
                        $('#userListContent').html(result);
                        hideLoading("userListContent");
                    }
                });
            });

            $.validator.addMethod('uniqueUsername',
                     function (value) {
                         var x = jQuery.ajax({
                             type: 'POST',
                             data: { username: value, uid: selectedUserID },
                             url: '<%= Html.AttributeEncode(Url.Action("CheckUsername")) %>',
                             async: false
                         }).responseText;
                         return x === "Available";
                     }, "This username already exists"
            );

            $.validator.addMethod('uniqueEmail',
                     function (value) {
                         var x = jQuery.ajax({
                             type: 'POST',
                             data: { email: value, uid: selectedUserID },
                             url: '<%= Html.AttributeEncode(Url.Action("CheckEmail")) %>',
                             async: false
                         }).responseText;
                         return x === "Available";
                     }, "This email already exists"
            );
            

            $.validator.addClassRules("unique-username", {
                uniqueUsername: true
            });

            $.validator.addClassRules("unique-email", {
                uniqueEmail: true
            });


        });

        function initSiteSelect() {
            $("#UserSite").change(function () {
                showLoading("selectionRoleContent", true);
                var siteID = $("#UserSite").val();
                jQuery.ajax({
                    type: 'POST',
                    data: { siteID: siteID },
                    url: '<%= Html.AttributeEncode(Url.Action("GetAvailableRoles")) %>',
                    success: function (result) {
                        hideLoading("selectionRoleContent");
                        $('#selectionRoleContent').html(result);
                    }
                });
                showLoading("selectionGroupContent", true);
                jQuery.ajax({
                    type: 'POST',
                    data: { siteID: siteID },
                    url: '<%= Html.AttributeEncode(Url.Action("GetAvailableGroups")) %>',
                    success: function (result) {
                        hideLoading("selectionGroupContent");
                        $('#selectionGroupContent').html(result);
                    }
                });
            });
        }

        function formValidate() {
            return $('form').validate({
                rules: {
                    "firstName": { required: true },
                    "lastName": { required: true },
                    "email": { required: true, email: true },
                    "userName": { required: true, minlength: 6 },
                    "password": { required: true, minlength: 6 },
                    "confirmPassword": { required: true, minlength: 6, equalTo: "#password" }
                },
                messages: {
                    "firstName": "First Name is required.",
                    "lastName": "Last Name is required.",
                    "email": { required: "Email address is required.", email: "Email address must be valid." },
                    "userName": { required: "Username is required.", minLength: "Your username must consist of at least 6 characters" },
                    "password": { required: "Password is required.", minLength: "Your password must consist of at least 6 characters" },
                    "confirmPassword": { required: "Confirm password is required.", minLength: "Your password must consist of at least 6 characters", equalTo: "Confirmed password does not match." }
                }
            }).form();
        }

    </script>
</asp:Content>
